<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Vue-Checkbox</title>
</head>
<body>



<!-- v-model 用于表单元素 -->
    <div id="app">
        <!--如果是一个复选框, 会把绑定的值转为布尔类型 : true 选中,false 取消 -->
        <input type="checkbox" v-model="check" > checkbox <span>{{check}}</span><br>

        <!-- 如果多个复选框 要增加value属性,并且绑定类型为数组 -->
        <input type="checkbox" v-model="orders" value="First"> 第一
        <input type="checkbox" v-model="orders" value="Second"> 第二
        <input type="checkbox" v-model="orders" value="Third"> 第三
        <input type="checkbox" v-model="orders" value="Fourth"> 第四
        <div>
            {{orders}}
        </div>

    </div>

<script src="../node_modules/vue/dist/vue.js"></script>

<script>
    let vm = new Vue({
        el: '#app',
        data: {
            check:1,
            orders: []

        },
        methods:{

        }
    })
</script>

</body>
</html>